export const textProps = {
  /** 图标
     * @type {string}
     */
  icon: String,
  /** 内容文本
   * @type {string}
   */
  text: String,
  /** 内容HTML
   * @type {string}
   */
  html: String,
}

export const titleProps = {
  /** 头部标题文字
   * @type {string}
   */
  title: String,
  /** 右上角带关闭图标
   * @type {boolean}
   */
  closeable: Boolean,
}

export const durationProps = {
  /** 展示时长(ms)，值为 0 时不会主动消失
   * @type {number}
   */
  duration: Number,
}

export const durationMixin = {
  props: durationProps,
  methods: {
    durationBegin() {
      const d = this.duration;
      if (d > 0) {
        const _d = this._duration;
        if (_d)
          clearTimeout(_d);
        this._duration = setTimeout(() => this.ref.modelValue = false, d);
      }
    },
    durationStop() {
      clearTimeout(this._duration);
      this._duration = undefined;
    }
  }
}

export const teleportMixin = {
  computed: {
    containerID() {
      if (this.position)
        return this.$options.name + '-' + this.position;
      else
        return this.$options.name;
    },
    container() {
      // 增加容器
      const id = this.containerID;
      const container = document.querySelector('#' + id) || document.body.appendChild(document.createElement("div"));
      container.id = id;
      container.classList.add(this.$options.name + '-container');
      return container;
    }
  }
}